/**
* @desc:  增加设备升级、编辑、查看
* @author qiankui
* @date 2023-4-19 14:11:31
*/
<template>
    <el-dialog :close-on-click-modal="false" :visible="configManageFlag" class="zdy-dialog" width="600px"
               :title="$t('Config management')" :before-close="handleCloseDialog">
        <el-form :model="form" class="pop-form-box" :rules="rules" ref="ruleForm">

            <el-row :gutter="20">
                <el-col :span="24">
                    <!--平台地址-->
                    <el-form-item :label="$t('Platform address')" prop="uploadUrl">
                        <el-input :title="form.uploadUrl" v-model="form.uploadUrl" :placeholder="$t('Please input platform address')" clearable></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="24">
                    <el-form-item label="OpenID" prop="appkey">
                        <!--请输入OpenID-->
                        <el-input :title="form.appkey" v-model="form.appkey" :placeholder="$t('Please enter OpenID')" clearable></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="24">
                    <el-form-item label="OpenKEY" prop="secret">
                        <!--请输入OpenKEY-->
                        <el-input :title="form.secret" v-model="form.secret" :placeholder="$t('Please enter OpenKEY')" clearable></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="24">
                    <el-form-item label="" prop="isUpload" style="margin-bottom: 0">
                        <el-checkbox v-model="form.isUpload"></el-checkbox>
                        <!--同意将《用户生物特征信息》上传到平台-->
                        <span class="prot" @click="showUserAgree">{{this.i18n.t('Agree to upload the User Biometric Information to the platform')}}</span>

                    </el-form-item>
                </el-col>
            </el-row>
          <br>
          <br>
            <div class="footBtnBox">
                <el-button size="small" type="handle" @click="handleCloseDialog">{{this.i18n.t('Cancel')}}</el-button>
                <el-button size="small" type="primary" :loading="saveloading" @click="submitForm">{{this.i18n.t('save')}}</el-button>
            </div>
        </el-form>
        <userAgreement :userAgreementFlag.sync="userAgreementFlag" v-if="userAgreementFlag"></userAgreement>
    </el-dialog>
</template>

<script>
    import {personnelinfoGetpersoneldatauploadconfig,personnelinfoSetpersoneldatauploadconfig} from "@/api/pcmj/zzxx";
    import userAgreement from './userAgreement'
    export default {
        name: "configManage",
        components: {
            userAgreement
        },
        props: {
            configManageFlag: {
                type: Boolean,
                default: false
            },
            editTableRow: {
                type: Object,
                defautl: () => {
                    return {}
                }
            }
        },
        watch: {

        },
        data() {
            var validateAddress = (rule, value, callback) => {
                value=value||""
                if (value == ''||value==null) {
                    // 请输入平台地址
                    callback(new Error(this.i18n.t('Please input platform address')));
                }else {
                    callback();
                }
            };
            var validateIsUpload = (rule, value, callback) => {
                value=value||""
                if (value == '') {
                    // callback();
                    // 请勾选《用户生物特征信息》协议
                    callback(new Error(this.i18n.t('Please check the agreement')));
                }else {
                    callback();
                }
            };
            return {
                userAgreementFlag:false,
                saveloading:false,
                rules: {
                    uploadUrl:[
                        {validator: validateAddress,required: true, trigger: 'blur'}
                    ],
                    isUpload:[
                        {validator: validateIsUpload,required: true, trigger: 'blur'}
                    ]
                },
                checked:true,
                saveDisabled:true,
                form:{
                    uploadUrl:'',
                    appkey:'',
                    secret:'',
                    isUpload:false,
                }
            }
        },
        mounted() {
            this.personnelinfoGetpersoneldatauploadconfig()
        },
        methods: {
            showUserAgree(){
                this.userAgreementFlag=true
            },
            personnelinfoSetpersoneldatauploadconfig(params){
                personnelinfoSetpersoneldatauploadconfig(params).then((res) => {
                    if (res.code == 200) {
                        // 保存成功
                        this.W.$tips("success", this.i18n.t('Successfully saved'));
                        // 关闭弹窗
                        this.$emit("update:configManageFlag",false);
                    }
                }).catch().finally(() => {
                    this.saveloading=false
                })
            },
            personnelinfoGetpersoneldatauploadconfig() {
                this.$nextTick(async () => {
                    personnelinfoGetpersoneldatauploadconfig().then((res) => {
                        if (res.code == 200) {
                            // debugger
                            this.form=res.data
                        }
                    }).catch(err=>{

                    }).finally(() => {

                    })

                });
            },
            /**
             * @description  关闭弹窗事件
             * @return not
             * @author xiongyi 2022-06-29 16:48:08
             **/
            handleCloseDialog() {
                this.$emit('update:configManageFlag', false);
                this.$emit('update:editTableRow', null);
            },
            /**
             * @description  保存新增活修改数据
             * @param  not
             * @return not
             * @author xiongyi 2022-07-06 10:50:18
             **/
            submitForm() {
                this.$refs.ruleForm.validate((valid) => {
                    if (valid) {
                        this.saveloading=true
                        this.personnelinfoSetpersoneldatauploadconfig(this.form)
                    }
                })
            }
        }
    }
</script>

<style scoped lang="scss">
    .zh-tip {
        position: relative;
        color: #727b8f;
        text-align: right;
        .tb-btn {
            color: #4264d0;
            text-decoration: underline;
            cursor: pointer;
        }
    }
    .dia-sc-btn {
        background-color: transparent;
        border: 1px dashed rgba(55, 101, 215, 0.5);
        color: rgba(55, 101, 215, 0.5);
    }
    .prot{
        margin-left: 10px;
        color:#409eff;
        &:hover{
            cursor: pointer;
            text-decoration:underline ;
        }
    }
</style>
